import React from 'react'
import {Row, Col, Form, Input, Select} from 'antd'
const {Option} = Select
const Room = () => {
  const [form] = Form.useForm()
  const layout = {
    labelCol: { span: 8 },
    wrapperCol: { span: 16 },
  };
  const allBed = (
    <div>
      个/间
    </div>
  )  
  return (
    <div>
      <Form
        form={form}
         {...layout}
        name="basic"
        initialValues={{ remember: true }}
      >   
        <Row>
          <Col span={9} offset={1}><Form.Item name="roomNums" label="房间数" rules={[{ required: true }]}><Input type='number' /></Form.Item></Col>
          <Col span={9} offset={1}><Form.Item name="roomNums1" label="房间床位" rules={[{ required: true }]}><Input type='number' addonAfter={allBed}/></Form.Item></Col>
          <Col span={9} offset={1}><Form.Item name="roomNums2" label="房型" rules={[{ required: true }]}><Select><Option value='睿沃智慧酒店401'>睿沃智慧酒店401</Option><Option value='睿沃智慧酒店402'>睿沃智慧酒店402</Option><Option value='睿沃智慧酒店403'>睿沃智慧酒店403</Option></Select></Form.Item></Col>
          <Col span={9} offset={1}><Form.Item name="roomNums3" label="可入住人数" rules={[{ required: true }]}><Input type='number' /></Form.Item></Col>
        </Row>
      </Form>
    </div>
  )
}

export default Room

